<template>
  <section>

    <div class="export">
      <el-button type='success' @click.stop = 'downLoadExcel'>
        导出Excel
      </el-button>
    </div>

    <el-table
      :data="tableData"
      border
      stripe
      style="width: 100%">
      <el-table-column
        v-for='(k,i) in tableCol'
        :prop="k.value"
        :label="k.label"
        align="center"
        >
					<template scope="scope" >
							{{ k.value == 'index' ? scope.$index + 1 : handleProps(scope,k.value)}}
					</template>
      </el-table-column>
    </el-table>

    <!-- <v-dialog :dialogVisible.sync='dialogVisible' :searchOption='searchOption' :emplid='emplid' :peopleName='peopleName' :dialogData='dialogData'  /> -->
  </section>
</template>

<script>
import Bus from './bus'
// import VDialog from './dialog'
import { Message } from 'element-ui'

export default {
	components: {

	},
	data () {
		return {
			tableData: [],
			tableCol: [{
				label: '序号',
				value: 'index'
			}, {
				label: '部门',
				value: 'dept_descr'
			},
			{
				label: '申请人',
				value: 'name',
				width: '300'
			}, {
				label: '假期类型',
				value: 'leave_type',
				width: '300'
			},
			{
				label: '总天数',
				width: '180',
				value: 'sum_days'
			},
			{
				label: '休假天数',
				width: '180',
				value: 'rest_days'
			}],
			dialogVisible: false,
			dialogData: [],
			searchOption: {},
			peopleName: '',
			emplid: ''
		}
	},
	methods: {
		handleProps (scope, val) {
			if (val == 'sum_days') {
				return !scope.row[val] || !parseInt(scope.row[val]) ? '' : scope.row[val]
			} else {
				return scope.row[val]
			}
		},
		showDialog (row) {
			this.setDialogData(row).then(() => this.dialogVisible = true)
		},
		setDialogData (row) {
			return new Promise((resolve) => {
				const { emplid, emplname } = row
				const params = {
					employeeCode: emplid,
					endTime: this.searchOption.end,
					departmentCode: this.searchOption.selected,
					startTime: this.searchOption.start,
				}
				this.peopleName = emplname
				this.emplid = emplid
				this.Axios.Post('vacationReport/employeeInfo', params)
					.then((res) => {
						this.dialogData = res.data.datas
						resolve()
					})
			})

		},
		downLoadExcel () {

			if (!this.tableData.length) {
				Message.warning('暂无数据,请重新搜索')
				return
			}
			const params = {
				start: this.searchOption.start,
				end: this.searchOption.end,
				name: this.searchOption.name,
				departmentCode: this.searchOption.selected,
				process_type: this.searchOption.vacationSelected
			}

			window.location.href = this.Axios.baseURI + '/vacationReport/vacationTypeExport' + '?employeeCode=' + params.name + '&endTime=' + params.end + '&startTime=' + params.start + '&token=' + localStorage.getItem('token') + '&departmentCode=' + params.departmentCode + '&processType=' + params.process_type
		}
	},
	mounted () {
		Bus.$on('tableData', (val) => this.tableData = val)
		Bus.$on('searchOption', (val) => this.searchOption = val)
	}
}
</script>

<style scoped>
section {
  padding: 30px 30px 0 20px;
}
.export {
  margin: 20px 0 10px 0;
}
</style>